<template>
  <div class="block">
    <el-timeline>
      <el-timeline-item
        v-for="(item,index) of timeline"
        :key="index"
        :timestamp="item.timestamp"
        placement="top"
      >
        <el-card>
          <h4>{{ item.pathogeny }}</h4>
          <p>{{ item.content }}</p>
          <el-button @click="handleDetail(item.id)">查看详细</el-button>
        </el-card>

      </el-timeline-item>
    </el-timeline>
    <el-dialog
      :visible.sync="dialogVisible"
      title="药方详情"
    >
      <Activitysee
        :prescription="prescription"
        @cancel="cancel"
      />
    </el-dialog>
  </div>
</template>

<script>
import { getPrescriptionInfoById, getPrescription } from '@/api/prescription'
import { timestampToTime } from '@/utils/time'
import Activitysee from './Activitysee'
import { timestampToTimeDay } from '@/utils/time'
const defaultPrescription = {
  pathogeny: '',
  day: '',
  type: '1',
  remake: '',
  adminId: '',
  userId: '',
  userInfoVO: {
    username: '',
    age: ''
  }
}

export default {
  components: {
    Activitysee
  },
  props: {
    // userId: {
    //   type: Number,
    //   default: 0
    // }
  },
  data() {
    return {
      dialogVisible: false,
      userId: '',
      timeline: [
        {
          timestamp: '2019/4/20',
          title: 'Update Github template',
          content: 'PanJiaChen committed 2019/4/20 20:46'
        },
        {
          timestamp: '2019/4/21',
          title: 'Update Github template',
          content: 'PanJiaChen committed 2019/4/21 20:46'
        },
        {
          timestamp: '2019/4/22',
          title: 'Build Template',
          content: 'PanJiaChen committed 2019/4/22 20:46'
        },
        {
          timestamp: '2019/4/23',
          title: 'Release New Version',
          content: 'PanJiaChen committed 2019/4/23 20:46'
        }
      ],
      prescription: Object.assign({}, defaultPrescription)
    }
  },
  mounted() {
    this.getPrescription()
  },
  methods: {
    async getPrescription() {
      if (this.$route.params.prescriptionId !== ':prescriptionId') {
        this.prescriptionId = this.$route.params.prescriptionId
        const { data } = await getPrescriptionInfoById({ id: this.$route.params.prescriptionId })
        this.userId = data.userId
        const data2 = await getPrescription({ userId: this.userId })
        for (const i in data2.data.list) {
          data2.data.list[i].timestamp = timestampToTime(data2.data.list[i].createTime)
        }
        this.timeline = data2.data.list
      } else {
        // this.$emit('showDialogUser')
      }
    },
    async handleDetail(scope) { // 查看详情
      this.dialogVisible = true
      const res = await getPrescriptionInfoById({ id: scope })
      console.log(res)
      res.data.medicationTimeStart = timestampToTimeDay(res.data.medicationTimeStart)
      res.data.medicationTimeEnd = timestampToTimeDay(res.data.medicationTimeEnd)
      this.prescription = res.data
    },
    cancel() {
      this.dialogVisible = false
    }
  }
}
</script>
